<!DOCTYPE html>
<html>

<head>
	<meta charset="UTF-8">
	<meta http-equiv="X-UA-Compatible" content="IE=9; IE=8; IE=7; IE=EDGE">
	<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />
	<title>个人登录</title>
	<link rel="icon" href="./img/favicon.ico">


    <link rel="stylesheet" type="text/css" href="./css/all.css" />
    <link rel="stylesheet" type="text/css" href="./css/pages-register.css" />
</head>

<body>
<div id="app">
	<div class="register py-container ">
		<!--loginByAccount-->
		<div class="registerArea">
			<h3>登录
			<span class="go">无账号，去<a href="register.html" target="_blank">注册</a></span>
			</h3>
			<div class="info">
				<form class="sui-form form-horizontal">
				<!-- 账号 -->
					<div class="control-group">
						<label for="inputPassword" class="control-label">账号：</label>
						<div class="controls">
							<input type="text" placeholder="请输入账号" class="input-xfat input-xlarge" v-model="account">
							<label>{{accountErrorMessage}}</label>
						</div>
					</div>
				<!-- 密码 -->
					<div class="control-group">
						<label for="inputPassword" class="control-label">登录密码：</label>
						<div class="controls">
							<input type="password" placeholder="请输入密码" class="input-xfat input-xlarge" v-model="password">
							<label>{{passwordErrorMessage}}</label>
						</div>
					</div>

						<div class="control-group">
						<label class="control-label"></label>
						<div class="controls btn-reg">
							<a  href="forgetPasswordFirst.html">忘记密码？</a>
							&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
							&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
						</div>
					</div>
					<div class="control-group">
						<label class="control-label"></label>
						<div class="controls btn-reg">
							<a class="sui-btn btn-block btn-xlarge btn-danger" @click="login()">登录</a>
						</div>
					</div>
				</form>
				<div class="clearfix"></div>
			</div>
		</div>
	</div>

</div>
</body>

<script src="js/vue.js"></script>
<script src="js/axios.js"></script>

<script>
new Vue({
	el:"#app",
	data:{
		password:"",
		account:"",

	},
	methods:{
		login:function(){
			//通过对象传参
			var params = new URLSearchParams();
			params.append("password",this.password);
			params.append("account",this.account);
			axios.post(
				"/user/login",
				params
			).then(res =>{
				console.info(res);
				if(res.data.code==112){
					this.passwordErrorMessage=res.data.msg;
				}
				if(res.data.code==111){
					this.accountErrorMessage=res.data.msg;
				}
				if(res.data.code==4){
					this.show=true;
					/* let Myoff = document.createElement("img");
					console.log(Myoff);
					Myoff.src="/captcha"; */
					const num = Math.ceil(Math.random() * 10)
					this.codeErrorMessage=res.data.msg;
				}
				if(res.data.code==200){
					window.location.href="/index.html";
				}
			});
		},

});
</script>


</html>